fix stretched components height #149
Conversation
✅ Deploy Preview for chipper-sunburst-578cfe ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
Any chance that it can fixed this using the daisyui or tailwind classes? |
|
@abdulhaseeb13mar |
src/app/styles/globals.css
Outdated
| .custom-auto-row-grid { | ||
| grid-auto-rows: auto auto auto 1fr 1fr; | ||
| } |
There was a problem hiding this comment.
can those be replaced by a built-in tailwindcss class?
There was a problem hiding this comment.
i didn't find equivalent or custom arbitrary class for auto-grid-rows. let me know if you find any. i will update
check now @EvgeniiaVak . i have updated the layout with css conditions for home or rest of the pages. because i think the rest of the pages are going to have a similar layout like /terms. only the homepage "/" needed to have a different Grid layout. |
| @@ -85,3 +85,12 @@ input[type="number"]::-ms-clear { | |||
| [data-theme] { | |||
| background-color: hsl(var(--b2) / var(--tw-bg-opacity, 1)); | |||
| } | |||
|
|
|||
| /* Grid layout for home page */ | |||
| .custom-auto-row-grid[data-path="/"] { | |||
There was a problem hiding this comment.
the path for this page will later change to /trade (and the landing page / will have different content, if the custom class names are unavoidable, please add another name and use it for the trading layout somewhere. you can add a div to wrap the trade page content if it doesn't exist yet
There was a problem hiding this comment.
it's alright, when it will be moved to the trade page, we just need to change this :
.custom-auto-row-grid[data-path="/"]
to this:
.custom-auto-row-grid[data-path="/trade"]
and the layout will work fine.
| @@ -85,3 +85,12 @@ input[type="number"]::-ms-clear { | |||
| [data-theme] { | |||
| background-color: hsl(var(--b2) / var(--tw-bg-opacity, 1)); | |||
| } | |||
|
|
|||
| /* Grid layout for home page */ | |||
| .custom-auto-row-grid[data-path="/"] { | |||
fixes #142